
<template>
	<block>
		<view class="wrap">
			<block>
				<view class="wrap_box">
					<view class="wrap_box_title">
						<text>{{nickName||'微信用户'}}</text>
						<view>
							<image :src="avatarUrl||'../../static/images/logo/logo.jpg'"></image>
						</view>
					</view>
					<block>
						<view class="wrap_box_content">
							<view class="wrap_box_content_title">用户使用次数</view>
							<view class="wrap_box_content_tip">
								{{userTimes||0}}次
							</view>
						</view>
						<view class="wrap_box_content">
							<view class="wrap_box_content_title">累计奖励红包</view>
							<view class="wrap_box_content_tip">
								<view class="aware-container">
									<image class="redbagimage" src="../../static/images/other/redbag.png"></image>
									<view class="aware-money">
										￥{{awardMoney/100||0}}
									</view>
								</view>
							</view>
						</view>
						<view class="wrap_box_content">
							<view class="wrap_box_content_title">邀请时间</view>
							<view class="wrap_box_content_tip">
								{{createTime||'0000-00-00 00:00:00'}}
							</view>
						</view>
					</block>
				</view>
			</block>
		</view>
	</block>
</template>

<script>
	export default {
		name: 'invite-card',
		props:["nickName","avatarUrl","userTimes","awardMoney","createTime"],
		data() {
			return {}
		},
	}
</script>

<style lang="scss">
	.aware-container{
		display: flex;
		justify-content: center;
		align-items: center;	
		height: 100%;
		float: right;
		.redbagimage{
			height: 50rpx;
			width: 50rpx;
		}
		.aware-money{
			color: red;
			margin-left: 5rpx;
		}
	}
	.wrap_box_title{
		align-items: center;
		view{
			float: right;
			background-color: #000000;
			width: 100rpx;
			height: 100rpx;
			margin-top: 6.5rpx;
			border-radius: 50%;
			image{
				width: 100%;
				height: 100%;
				border-radius: 50%;
			}
		}
	}
	.wrap {
		// position: absolute;
		// width: 100%;
		// height: 100%;
		// background: rgba(99, 147, 255, 0.1000);

		&_box {
			margin: 0 15rpx 40rpx 15rpx;
			box-sizing: border-box;
			margin-bottom: 40rpx;
			box-shadow: 0px 0px 17rpx 0px rgba(99, 147, 255, 0.3000);
			border-radius: 30rpx;

			&_title {
				height: 113rpx;
				line-height: 113rpx;
				padding-left: 30rpx;
				padding-right: 30rpx;
				font-weight: 600;
				font-size: 34rpx;
				background: rgba(79, 147, 255, 0.4000);
				border-radius: 30rpx 30rpx 0 0;
			}

			&_content {
				display: flex;
				height: 112rpx;
				line-height: 112rpx;
				padding: 0 30rpx;
				color: #333;
				font-weight: 400;
				font-size: 34rpx;
				background: #FFFFFF;
				border-bottom: 1px solid rgba(0, 0, 0, 0.1000);

				&_title {}

				&_tip {
					flex: 1;
					text-align: right;

				}
			}

			&_content:last-child {
				border-radius: 0 0 30rpx 30rpx;
			}
		}
	}
</style>